<template>
	<view class="content">
		<view class="lg_ico">
			<image src="../static/imgs/niutou.jpg" />
		</view>
		<!-- 登录 -->
		<input type="text" @blur="setPhone" name="phone" placeholder="请输入手机号">
		<input type="password" @blur="setPwd" name="password" placeholder="请输入密码">
		<div class="forget" @click="forget">忘记密码?</div>
		<!-- <div class="foot">
					<button>登录</button>
					<button>注册</button>
				</div> -->
		<view class="btns">
			<button @click="login">登录</button>
			<button @click="register">注册</button>
		</view>
	</view>
</template>

<script>
	import {
		LOGIN,
		MEMBER_INFO,
		ST_TOKEN,
		SEND_RESULT,
		MOBILE,
		CODE
	} from "../constants/index.js"
	export default {
		data() {
			return {
				loginInfo: {
					phone: '',
					password: '',
				}
			};
		},
		methods: {
			// 点击登录
			// lg_submit(e){
			// 	// 登录（填写的信息）

			// 	let data=e.detail.value;
			setPhone(e) {
				this.loginInfo.phone = e.detail.value;
			},
			setPwd(e) {
				this.loginInfo.password = e.detail.value;
			},

			login() {
				// 校验
				if (this.loginInfo.phone.length < 11) {
					return uni.showToast({
						title: '请确认电话格式！',
					});
				}

				var re = /^1[1356789]\d{9}$/;
				let str = this.loginInfo.phone;
				// if (!re.test(str)) {
				// 	return uni.showToast({
				// 		title: '请确认电话格式！',
				// 	});
				// }
				// 校验
				if (this.loginInfo.phone.length < 11) {
					return uni.showToast({
						title: '请确认电话格式！',
					});
				}
				if (this.loginInfo.password.length <= 0) {
					return uni.showToast({
						title: '请输入密码',
					});
				}

				// 后台数据交互
				this.$request.post(LOGIN, this.loginInfo).then(res => {
					console.log(res)
					// 登录失败
					if (res != 1) {
						// 隐藏当前页
						uni.hideLoading();
						return uni.showToast({
							title: '登录失败！',
						});
					}
					// 登录成功
					uni.showToast({
						title: '登录成功！'
					})
					this.$request.post(SEND_RESULT, this.loginInfo).then(res => {
						uni.setStorageSync('login_info', this.loginInfo)
						uni.setStorageSync(MEMBER_INFO, res.member)
						uni.setStorageSync(MOBILE, res.member.mobile)
						uni.setStorageSync(CODE, res.member.code)
						uni.setStorageSync(ST_TOKEN, res.token)
						uni.hideLoading();
					}).catch((e) => {});
					// 跳转页面
					setTimeout(function() {
						uni.reLaunch({
							url: './grab/index'
						})
					}, 2000)
				})


			},
			// 点击注册
			register() {
				uni.navigateTo({
					url: './register'
				})
			},

			//忘记密码
			forget() {
				uni.navigateTo({
					url: 'forget/forget'
				})
			},

		},
	}
</script>

<style>
	.content {
		padding: 0 50rpx;
	}

	/* 登录---小logo图标 */
	.lg_ico {
		text-align: center;
		padding-top: 25rpx;
	}

	.lg_ico image {
		width: 150rpx;
		height: 150rpx;
		border-radius: 50rpx;
	}

	input {
		margin-top: 40rpx;
		padding-left: 20rpx;
		font-size: 13px;
		border-radius: 20rpx;
		height: 80rpx;
		border: 1px #C0C0C0 solid;
	}

	.forget {
		/* margin-left: 500rpx; */
		font-size: 11px;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
	}

	button {
		display: inline;
		border-radius: 25rpx;
		/* width: 50%; */
		font-size: 15px;
		color: white;
		margin-top: 40rpx;
		margin-right: 20rpx;
	}

	/* foot{
		
		display: flex;
		flex-direction: column;
		align-items: center;
	} */

	.btns {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 40rpx;
		width: 100%;
	}

	.btns button {
		color: #fff;
		background: rgb(247, 149, 184);
		margin: 0;
		padding: 0;
		width: 48%;
		height: 88rpx;
	}

	/* .btns .login {
		color: #FFFFFF;
		background: rgb(0, 148, 255);
	}
	 */
</style>
